<template>
    <div style="background: #111214;color:#fff; width: 100%;min-height: 100vh;">
      <native :title="title"></native>
      <div class="payment-home">
          <div class="payment-home-back">
            <img src="../assets/img/Z.svg" alt="">
            <div class="font-36" style="text-align: center;padding-top: 8px;">{{withdrawNum}}</div>
            <div class="payment-font1">{{code}}</div>
          </div>
          <div style="font-size: 14px;color: rgba(255, 255, 255, .4);text-align: center;margin-top: 10px;font-family: axis;">≈43.695CNY</div>
          <div class="payment-home-bottom">
            <div class="payment-home-flex">
              <div class="payment-font">到账地址</div>
              <div style="font-family: axis;">{{withdrawAddress}}</div>
            </div>
            <div class="payment-home-flex">
              <div class="payment-font">到账数量</div>
              <div style="font-family: axis;">{{accountNum}} {{code}}</div>
            </div>
            <div class="payment-home-flex">
              <div class="payment-font">充值时间</div>
              <div style="font-family: axis;">{{date}}</div>
            </div>
          </div>
      </div>
      <div class="confirmWithdrawal-btn" @click="jumpTake">
        <img src="../assets/img/transfer-icon-cashout-2.svg" alt="">
        <span>确认提现</span>
      </div>
      <transactionPassword  v-if="showNumKey" @transactNum="transactNum" :usdtNum="withdrawNum" @returnFalse="returnFalse"></transactionPassword>
    </div>

  </template>

  <script>
  import native from './public/native.vue'
  import transactionPassword from './public/transactionPassword.vue' 
  import { Toast } from 'vant' 
  export default {
    name: 'confirmWithdrawal',
    data () {
      return {
        title:'确认提现',
        showNumKey:false,
        withdrawAddress:'',
        code:'',
        withdrawNum:0,
        accountNum:0,
        date:''
      }
    },  
    components:{
      native,transactionPassword
    },
    computed: {
      
    },
    mounted() {
      this.date = this.utils.dateZhuan(new Date());
      this.withdrawAddress = localStorage.getItem('withdrawAddress');
      this.code = localStorage.getItem('code');
      this.withdrawNum = localStorage.getItem('withdrawNum');
      this.accountNum = localStorage.getItem('accountNum');
    },
    methods: {
      jumpTake(){
        this.showNumKey = true;
      },
      returnFalse(data){
        this.showNumKey = data;
      },
      transactNum(data){
        var list = {
          exchangePwd:this.$md5(data),
          withdrawAddress:this.withdrawAddress,
          withdrawNum:this.withdrawNum,
          currency:this.code
        };
        this.$http.post(this.utils.config+"/gz/assets/withdraw",list).then((data)=>{
          if(data.data.success){
              Toast('提交成功！')
              this.$router.push('/assetsManagement');
          }else{
            Toast(data.data.msg)
          }
        })
      }
    },
  }
  </script>

  <!-- Add "scoped" attribute to limit CSS to this component only -->
  <style lang="less" scoped>
    .payment-home{
      padding:21px;
    }
    .payment-home-back{
      position: relative;
      img{
        width: 100%;
        position: absolute;
        top:0px;
      }
    }
    .payment-font1{
      font-family: axis;
      font-size: 20px;
      text-align: center;
    }
    .payment-font{
      color: rgba(255, 255, 255, .8);
    }
    .payment-home-bottom{
      padding-top: 23px;
      font-size: 14px;
      color: rgba(255, 255, 255, .4);
    }
    .payment-home-flex{
      display: flex;
      justify-content: space-between;
      padding: 15px 0px;
      border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }
    .confirmWithdrawal-btn{
      position: fixed;
      bottom: 0px;
      width: calc(100% - 30px);
      height: 56px;
      line-height: 56px;
      margin-left: 15px;
      margin-bottom: 10px;
      background-color: #6E59FF;
      border-radius: 6px;
      text-align: center;
      font-size: 16px;
      img{
        vertical-align: middle;
        position: relative;
        top: -2px;
      }
    }
  </style>
